/*
write by       : wuweiwei (邬畏畏)
blogs          : www.blogs.com/wsoft
WUI            : www.flybirdsoft.com/WUI

function:
模拟iphone
*/




var iPhoneLayer = {
	pageIndex : 0,
	pageCount : 0,
	level     : 0, /*当前的菜单级别*/
};

/*
options = {
	tipHTML : "",
	onClick : function(object){}
	menus : [
		{
		icon  : "",  必选
		text  : "",  可选
		url   : "",  可选
		name  : "",
		index : n,
		type  : "",
		level : n ,
		children:[
				{
					name : "",
					icon : "",
					index: n ,
					type  : "",
					url   : "",
					level : n
				}
			]
		}
	] , 
	grid : {
	cellWidth:n,
	cellHeight:n,
	rowCount : n,
	colCount : n
	}
}
*/

iPhoneLayer.initLayer = function(options){
	iPhoneLayer.options = options;
	iPhoneLayer.createMask();
	iPhoneLayer.createLayer();
	iPhoneLayer.appendBox();
	iPhoneLayer.initEvent();
}

iPhoneLayer.getGird = function(){
	var gridOptions = iPhoneLayer.options.grid;

	return{
		width : ((gridOptions.cellWidth+20)*gridOptions.colCount),
		height: ((gridOptions.cellHeight+20)*gridOptions.rowCount),
		rowCount:gridOptions.rowCount,
		colCount:gridOptions.colCount,
		cellWidth:gridOptions.cellWidth,
		cellHeight:gridOptions.cellHeight
	}
}


iPhoneLayer.createLayer = function(){
	/*sun button*/
	var body = document.getElementsByTagName("body")[0];
	var iLayer = document.createElement("div");
	iLayer.id="iPhoneLayer";
	iLayer.className = "iPhoneLayer";
	iLayer.style.position = "fixed";
	iLayer.style.bottom = "20px";
	iLayer.style.right = "20px";
	iLayer.style.zIndex = 5002
	iLayer.innerHTML = iPhoneLayer.options.tipHTML || "&nbsp;";
	iLayer.className = "iPhoneLayer";
	body.appendChild(iLayer);

	var iBox = document.createElement("div");
	var gridBox = iPhoneLayer.getGird();
	iBox.id = "iBox";
	iBox.className = "iBox";
	iBox.style.zIndex = 5001;
	iBox.style.position = "fixed";
	iBox.style.left = "50%";
	iBox.style.top = "50%";
	iBox.style.width = gridBox.width + "px";
	iBox.style.height = (gridBox.height + 30) + "px";
	iBox.style.marginLeft = "-" + gridBox.width/2 + "px";
	iBox.style.marginTop = "-" + gridBox.height/2 + "px";
	iBox.style.padding = "10px";
	iBox.style.display = "none";
	body.appendChild(iBox);
}


iPhoneLayer.createMask = function(color){
	var mask = document.createElement("div");
	mask.id="iMask";
	mask.className = "iMask";
	mask.style.position = "fixed";
	mask.style.height = "100%";
	mask.style.width = "100%";
	mask.style.backgroundColor = "#555";
	mask.style.opacity = 0.3;
	mask.style.zIndex = 5000;
	mask.style.top = "0";
	mask.style.left = "0";
	mask.style.display = "none";
	var body = document.getElementsByTagName("body")[0];
	body.appendChild(mask);
}

iPhoneLayer.appendBox = function(){
	var box = iPhoneLayer.getGird();
	var rowCount = box.rowCount;
	var colCount = box.colCount;
	var count = rowCount * colCount;
	var i,j,k,page=0; /*page表示有几页*/
	var menus = iPhoneLayer.options.menus;
	var HTML = '<div index="{index}" class="box {icon}" style="{style}">&nbsp;</div>';
	var html,htmls="";
	var iBoxNext=null;

	for(i=0;i<menus.length;i++)
	{
		if(i%count==0)
		{
			if(iBoxNext!=null)
			{
				iBoxNext.innerHTML = htmls;
				htmls = "";
			}
			iBoxNext = document.createElement("div");
			iBoxNext.id="iBoxNext"+page;
			iBoxNext.className = "iBoxNext";
			iBoxNext.style.overflow = "hidden";
			if(i!=0)
			{
				iBoxNext.style.display = "none";
			}
			page++;
			document.getElementById("iBox").appendChild(iBoxNext);
		}
		html = HTML.replace("{icon}",menus[i].icon || "");
		html = html.replace("{index}",i);
		html = html.replace("&nbsp;",menus[i].text||"&nbsp;");
		html = html.replace("{style}","width:"+box.cellWidth+"px;height:"+box.cellHeight+"px;float:left;margin-left:10px;margin-right:10px;margin-top:10px;margin-bottom:10px;");

		htmls += html;

		if(menus.children!=undefined)
		{
			for(j=0;j<menus.children.length;j++)
			{

			}
		}
		iPhoneLayer.pageCount = page;
		iBoxNext.innerHTML = htmls;
	}/*end for i*/

	/*浮动菜单*/
	var iBoxMenu = document.createElement("dl");
	iBoxMenu.id="iBoxMenu";
	iBoxMenu.className = "iBoxMenu";
	iBoxMenu.style.position = "absolute";
	iBoxMenu.style.width = "100%";
	iBoxMenu.style.marginLeft = "-10px";
	iBoxMenu.style.bottom = "5px";
	iBoxMenu.style.height="30px";
	iBoxMenu.style.borderTop = "1px solid #aaa";
	document.getElementById("iBox").appendChild(iBoxMenu);
	var HTML = '<dt class="iBoxMenu-item iBoxMenu-item-prev" style="float:left;cursor:pointer;display:none;margin-left:10px;">上一页</dt>'+
	           '<dt class="iBoxMenu-item iBoxMenu-item-close" style="float:right;margin-left:5px;cursor:pointer;margin-right:10px;">关闭</dt>'+
	           '<dt class="iBoxMenu-item iBoxMenu-item-return" style="float:right;margin-left:5px;cursor:pointer;display:none;">返回</dt>'+
	           '<dt class="iBoxMenu-item iBoxMenu-item-next" style="float:right;margin-left:5px;cursor:pointer;">下一页</dt>';
	iBoxMenu.innerHTML = HTML;
	if(page <= 1)
	{
		$("#iBoxMenu .iBoxMenu-item-prev").hide();
		$("#iBoxMenu .iBoxMenu-item-next").hide();
	}
}

iPhoneLayer.initEvent = function(){

	$("#iPhoneLayer").bind("click",function(){
		$("#iBox").toggle();
		$("#iMask").toggle();
	});

	/*单击菜单处理函数*/
	$("#iBox div").live("click",function(e){
		e.stopPropagation();
		var target = e.target;
		var index = $(target).attr("index");
		var url = iPhoneLayer.options.menus[index].url;
		if(iPhoneLayer.options.onClick!=undefined)
		{
			iPhoneLayer.options.onClick.call(this,iPhoneLayer.options.menus[index]);	
		}
		else if(iPhoneLayer.options.menus[index].onClick!=undefined)
		{
			iPhoneLayer.options.menus[index].onClick.call(this,iPhoneLayer.options.menus[index]);
		}
		if(url!=undefined)
		{
			window.location.href = url;
		}
	});

	$("#iBoxMenu .iBoxMenu-item-close").bind("click",function(){
		$("#iBox").hide();
		$("#iMask").hide();
	});

	/*下一页功能*/
	$("#iBoxMenu .iBoxMenu-item-next").bind("click",function(){
		$("#iBox #iBoxNext"+iPhoneLayer.pageIndex).hide();
		iPhoneLayer.pageIndex++;

		if(iPhoneLayer.pageIndex<iPhoneLayer.pageCount)
		{
			$("#iBox #iBoxNext"+iPhoneLayer.pageIndex).show();
			if(iPhoneLayer.pageCount - iPhoneLayer.pageIndex == 1)
			{
				$("#iBoxMenu .iBoxMenu-item-next").hide();
			}
		}
		else/*最后一页*/
		{
			iPhoneLayer.pageIndex = iPhoneLayer.pageCount - 1;
			$("#iBox #iBoxNext"+iPhoneLayer.pageIndex).show();
		}

		if(iPhoneLayer.pageIndex>0)/*显示上一页*/
		{
			$("#iBoxMenu .iBoxMenu-item-prev").show();
		}
	});

	/*上一页功能*/
	$("#iBoxMenu .iBoxMenu-item-prev").bind("click",function(){
		$("#iBox #iBoxNext"+iPhoneLayer.pageIndex).hide();
		iPhoneLayer.pageIndex--;

		if(iPhoneLayer.pageIndex>=0)
		{
			$("#iBox #iBoxNext"+iPhoneLayer.pageIndex).show();
			if(iPhoneLayer.pageIndex == 0)
			{
				$("#iBoxMenu .iBoxMenu-item-prev").hide();
			}
		}
		else/*最后一页*/
		{
			iPhoneLayer.pageIndex = 0;
			$("#iBox #iBoxNext"+iPhoneLayer.pageIndex).show();
		}

		if(iPhoneLayer.pageIndex==0)/*显示下一一页*/
		{
			$("#iBoxMenu .iBoxMenu-item-next").show();
		}
	});

}/*end function initEvent*/



